<template>
	<view class="h-168"></view>
	<view class="z-foot fd-r">
		<tm-badge :count="cartTotal" :maxCount="99" color="red" linear="top">
			<view class="w-72 h-72 fd-r jc-c" @click="HGotoCart">
				<tm-icon
					:font-size="50"
					name="tmicon-shoppingcart"
					:color="cartTotal > 0 ? '#F7B52C' : '#ABABAB'"
				></tm-icon>
			</view>
		</tm-badge>

		<view class="flex1 pl-24 fd-r ai-fe text-#000000">
			<!-- <text class="fs-20">￥</text>
			<text class="fs-30 fw-b">0.00</text> -->
		</view>

		<button
			class="btn-red h-60 rd-30 fs-22 fw-b lh-60rpx c-white mr-16"
			@click="HAddToCart"
		>
			加入购物车
		</button>

		<button class="btn-red h-60 rd-30 fs-22 fw-b lh-60rpx c-white">
			立即购买
		</button>
	</view>
</template>

<script setup>
import { ref } from 'vue';
import { storeToRefs } from 'pinia';
import { useCartStore } from '@/store/cart.js';
const cartStore = useCartStore();
const { cartTotal } = storeToRefs(cartStore);

import toolLogin from '@/utils/login.js';
const emit = defineEmits(['addToCart']);
const HAddToCart = () => {
	toolLogin.isNeedToLogin((res) => {
		if (res) {
			emit('showSku', 'add');
		}
	});
};

const HBuyNow = () => {
	toolLogin.isNeedToLogin((res) => {
		if (res) {
			emit('showSku', 'buy');
		}
	});
};

const HGotoCart = () => {
	toolLogin.isNeedToLogin((res) => {
		if (res) {
			uni.switchTab({ url: '/pages/tabbar/tab3/index' });
		}
	});
};
</script>

<style scoped>
.z-foot {
	border-top: 1px solid #e5e5e5;
	padding: 12rpx 24rpx;
	background-color: white;
	z-index: 10;
}
</style>
